function List(props) {
  /* 
    children 中的属性都是只读
    1 - 对象  虚拟DOM对象
    2 - 字符串  文本节点
    3 - 数组   多个节点的时候
    4 - undefined 没有包含任何节点
  */
  let { data = [], children, render } = props;
  //  children 对应的是组件包含的内容 （slot）
  return <ul>
    {
      data.map(item => <li key={item}>{render(item)}</li>)
    }
  </ul>
}
export default List